<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="./css/reset.css">
  <link rel="stylesheet" href="./css/testReview.css">
  <title>培训管理</title>
</head>
<script>
  function getParam(name) {
    return location.href.match(new RegExp('[?#&]' + name + '=([^?#&]+)', 'i')) ? RegExp.$1 : '';
  }
  var magicHtmlPath = '/obpm/html'
  var obpmFilePath = '/obpm'
  var appName = getParam('magicAppName')
  var accessToken = getParam('accessToken')
  document.cookie = "accessToken=" + accessToken + ";path=/";
  localStorage.setItem("accessToken", accessToken)
  var ajax = function (data) {
    return new Promise((resolve, reject) => {
      var xhr = new XMLHttpRequest();
      xhr.onreadystatechange = function () {
        if (xhr.readyState === 4) {
          if (
            (xhr.status >= 200 && xhr.status < 300) ||
            xhr.status === 304
          ) {
            // resolve(xhr.responseText);
            data.success(xhr.responseText);
          } else {
            reject(xhr.status);
          }
        } else {
          // HTTP请求还在继续...
        }
      };
      xhr.open(data.methods, data.url, data.async);
      xhr.setRequestHeader("content-type", "application/json");

      delete data.methods;
      delete data.url;
      xhr.send(JSON.stringify(data.data));
    });
  };
  var allData = {}
  var test_paper_id = getParam('test_paper_id');
  var exam_id = getParam('exam_id');
  var student_id = getParam('student_id');
  var full_name = getParam('full_name');
  function okReview() {
    let question_list = [] //阅卷题目列表(问答和填空)
    let exam_list = allData.exam_list
    let flag = true
    let subjectivity = []//主观的
    for(let i = 0; i < exam_list.length; i ++) {
      if(exam_list[i].question_type != '单选题' && exam_list[i].question_type != '多选题' && exam_list[i].question_type != '判断题' && exam_list[i].question_type != '填空题') {
        let input = document.getElementById(exam_list[i].question_id + '_input').value
        subjectivity.push(exam_list[i].question_id)
        if(!input) {
          flag = false
          document.getElementById(exam_list[i].question_id).innerHTML = '请输入该题的得分'
          document.getElementById(exam_list[i].question_id).style.display = ''
        }else {
          if(input > exam_list[i].score) {
            flag = false
            document.getElementById(exam_list[i].question_id).innerHTML = '您打的分数已超过该题目的分值'
            document.getElementById(exam_list[i].question_id).style.display = ''
          }else {
            document.getElementById(exam_list[i].question_id).style.display = 'none'
          }
        }
      }
    }
    if(flag) {
      for(let j = 0; j < subjectivity.length; j++) {
        let obj = {
          test_questions_id:subjectivity[j],
          remarks: document.getElementById(subjectivity[j] + '_textarea').value,
          score: document.getElementById(subjectivity[j] + '_input').value
        }
        question_list.push(obj)
      }

    }else {
      return
    }
    let data = {
      data: {
        exam_id:exam_id,
        student_id:student_id,
        full_name:full_name,
        question_list: question_list
      }
    }
    let review = {
      methods: "post",
      url: `${obpmFilePath}/magic-api/${appName}/review_submit`,
      async: true,
      data:data,
      success: function (result) {
        alert('阅卷成功')
        let main = document.getElementById('main')
        main.innerHTML = '<div style="height: 100%;display: flex;align-items: center;font-size: 26px;justify-content: center;"><div>阅卷成功！</div></div>'
      }
    }
    ajax(review)
  }
  function mate(student_answer,options) {
    if(student_answer) {
      let arr  = student_answer.split(';')
      for(let i = 0;i < arr.length; i ++) {
        if(arr[i] == options) {
          return 'checked'
        }
      }
    }else {
      return ''
    }
  }
  function getResult() {
    let data = {
      test_paper_id:test_paper_id,
      exam_id:exam_id,
	  student_id:student_id,
	  full_name:full_name
    }
    let examResult = {
      methods: "post",
      url: `${obpmFilePath}/magic-api/${appName}/exam_marking_info`,
      async: true,
      data:data,
      success: function (result) {
        if(JSON.parse(result).data) {
          let exam_info = JSON.parse(result).data.exam_info
          document.getElementsByClassName('exameName')[0].innerHTML = `
          <div class="name">学员名称：${exam_info.student_name}</div>
          <div class="name">试卷名称：${exam_info.exam_name}</div>
          <div class="name">当前总分：${exam_info.current_student_score}</div>
          `
          // document.getElementsByClassName('exameDetail')[0].innerHTML = `
          //   用时：${exam_info.test_time} | 交卷时间：${exam_info.hand_in_time} | 考试总分：${exam_info.test_score} | 通过分数：${exam_info.pass_mark}
          // `
          allData = JSON.parse(result).data
          let exam_list = JSON.parse(result).data.exam_list
          let passHtml = ''
          for(let i = 0; i < exam_list.length; i ++) {
            if(exam_list[i].question_type == '单选题') {
              let options = exam_list[i].options
              let student_answer_html = ''//回答
              let optionsHtml = ''
              let answer_html = '' //参考答案
              for(let j = 0; j < options.length; j ++) {
                optionsHtml += `<div class="onceOption"><input type="radio" value="${options[j]}" disabled ${mate(exam_list[i].student_answer,options[j]) ? 'checked' : ''}>${String.fromCharCode(65+j)}、${options[j]}</div>`
                answer_html += `<div class="onceOption"><input type="radio" value="${options[j]}" disabled ${mate(exam_list[i].answer,options[j]) ? 'checked' : ''}>${String.fromCharCode(65+j)}、${options[j]}</div>`
              }
              passHtml += `
              <div class="exameOnce">
                <div class="examTopic"><span class="order">${i + 1}、</span>${exam_list[i].question_type}：${exam_list[i].question_name}     (分值：${exam_list[i].score} )</div>
                <div class="examOption">
                  <div class="left">回答：</div>
                  ${optionsHtml}
                </div>
                <div class="examOption">
                  <div class="left">参考答案：</div>
                  ${answer_html}
                </div>
                <div class="examOption">
                  <div class="left">得分：</div>
                  <div class="passScroe">${exam_list[i].student_score}</div>
                </div>
              </div>
              `
            }else if(exam_list[i].question_type == '多选题') {
              let options = exam_list[i].options
              let optionsHtml = ''
              let student_answer_html = ''//回答
              let answer_html = '' //参考答案
              for(let j = 0; j < options.length; j ++) {
                // ${exam_list[i].student_answer.split(';')[j] ? (exam_list[i].student_answer.split(';')[j] == options[j] ? 'checked' : '') : ''}
                optionsHtml += `<div class="onceOption"><input type="checkbox" value="${options[j]}" disabled ${mate(exam_list[i].student_answer,options[j]) ? 'checked' : ''}>${String.fromCharCode(65+j)}、${options[j]}</div>`
                answer_html += `<div class="onceOption"><input type="checkbox" value="${options[j]}" disabled ${mate(exam_list[i].answer,options[j]) ? 'checked' : ''}>${String.fromCharCode(65+j)}、${options[j]}</div>`
              }
              passHtml += `
              <div class="exameOnce">
                <div class="examTopic"><span class="order">${i + 1}、</span>${exam_list[i].question_type}：${exam_list[i].question_name}     (分值：${exam_list[i].score} )</div>
                <div class="examOption">
                  <div class="left">回答：</div>
                  ${optionsHtml}
                </div>
                <div class="examOption">
                  <div class="left">参考答案：</div>
                  ${answer_html}
                </div>
                <div class="examOption">
                  <div class="left">得分：</div>
                  <div class="passScroe">${exam_list[i].student_score}</div>
                </div>
              </div>
              `
            }else if(exam_list[i].question_type == '判断题' || exam_list[i].question_type == '填空题'){
              let optionsHtml = ''
              passHtml += `
              <div class="exameOnce">
                <div class="examTopic"><span class="order">${i + 1}、</span>${exam_list[i].question_type}：${exam_list[i].question_name}     (分值：${exam_list[i].score} )</div>
                <div class="examOption">
                  <div class="left">回答：</div>
                  <div class="onceOption">${exam_list[i].student_answer}</div>
                </div>
                <div class="examOption">
                  <div class="left">参考答案：</div>
                  <div class="onceOption">${exam_list[i].answer_resolution}</div>
                </div>
                <div class="examOption">
                  <div class="left">得分：</div>
                  <div class="passScroe textInput">${exam_list[i].student_score}</div>
                </div>
              </div>`
            }else {
              let optionsHtml = ''
              passHtml += `
              <div class="exameOnce">
                <div class="examTopic"><span class="order">${i + 1}、</span>${exam_list[i].question_type}：${exam_list[i].question_name}     (分值：${exam_list[i].score} )</div>
                <div class="examOption">
                  <div class="left">回答：</div>
                  <div class="onceOption">${exam_list[i].student_answer}</div>
                </div>
                <div class="examOption">
                  <div class="left">参考答案：</div>
                  <div class="onceOption">${exam_list[i].answer_resolution}</div>
                </div>
                <div class="examOption" style="padding-bottom:10px;">
                  <div class="left"><span style="color:red;">*</span>打分：</div>
                  <div class="passScroe textInput"><input type="text" id="${exam_list[i].question_id+'_input'}"></div>
                  <span class="exameError" id="${exam_list[i].question_id}" style="display:none;">请输入该题的得分</span>
                </div>
                <div class="examOption">
                  <div class="left">批注：</div>
                  <div class="passScroe textInput"><textarea rows="5" id="${exam_list[i].question_id+'_textarea'}"></textarea></div>
                </div>
              </div>
              `
            }
          }
          passHtml += `
            <div style="text-align:right;padding-bottom:10px;"><span class="total" onclick="okReview()">阅卷完毕</span></div>
          `
          document.getElementsByClassName('pass')[0].innerHTML = passHtml
          
        }else {
        }
      }
    }
    ajax(examResult)
  }
</script>
<body onload="getResult()">
  <div id="main">
    <!-- <div class="header">
      考试结果
    </div> -->
    <div class="content">
      <div class="exameIntroduc">
        <div class="exameName">
        </div>
        <div class="exameDetail">
        </div>
      </div>
      <div class="unread"></div>
      <div class="unPass"></div>
      <div class="pass"></div>
    </div>
  </div>
</body>
</html>